<template>
  <div class="ly-page">
    <ul class="ly-list-input">
      <li>
        <label class="ly-label">总部地址：</label>
        <el-input class="ly-input ly-link" v-model="consult.address" size="small" placeholder="请输入总部地址"></el-input>
      </li>
      <li>
        <label class="ly-label">泉州地址：</label>
        <el-input class="ly-input ly-link" v-model="consult.quanzhouAddress" size="small"
                  placeholder="请输入泉州地址"></el-input>
      </li>
      <li>
        <label class="ly-label">三明地址：</label>
        <el-input class="ly-input ly-link" v-model="consult.sanmingAddress" size="small"
                  placeholder="请输入三明地址"></el-input>
      </li>
      <li>
        <label class="ly-label">厦门地址：</label>
        <el-input class="ly-input ly-link" v-model="consult.xiamenAddress" size="small"
                  placeholder="请输入厦门地址"></el-input>
      </li>
      <li>
        <label class="ly-label">固定电话：</label>
        <el-input class="ly-input ly-link" v-model="consult.compangTelephone" size="small"
                  placeholder="固定电话"></el-input>
      </li>
      <li>
        <label class="ly-label">移动电话：</label>
        <el-input class="ly-input ly-link" v-model="consult.compangMobile" size="small" placeholder="移动电话"></el-input>
      </li>
      <li>
        <label class="ly-label">邮箱：</label>
        <el-input class="ly-input ly-link" v-model="consult.companyEmail" size="small" placeholder="邮箱"></el-input>
      </li>
      <li>
        <label class="ly-label">传真：</label>
        <el-input class="ly-input ly-link" v-model="consult.companyFax" size="small" placeholder="传真"></el-input>
      </li>
      <li>
        <label class="ly-label">公司主页：</label>
        <el-input class="ly-input " v-model="consult.companyUrl" size="small" placeholder="公司主页"></el-input>
      </li>
      <li>
        <label class="ly-label">地图经纬度：</label>
        纬度
        <el-input class="ly-input" v-model="consult.latitude" size="small" placeholder="纬度"></el-input>
        经度
        <el-input class="ly-input" v-model="consult.longitude" size="small" placeholder="经度"></el-input>
      </li>
      <li>
        <label class="ly-label">小程序二维码：</label>
        <el-upload class="avatar-uploader" :action="action" :show-file-list="false"
                   :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
          <img class="ly-img" title="上传图片" :src="consult.miniPic"/>
        </el-upload>
      </li>
      <li>
        <label class="ly-label">微信公众号二维码：</label>
        <el-upload class="avatar-uploader" :action="action" :show-file-list="false"
                   :on-success="handleAvatarSuccess1" :before-upload="beforeAvatarUpload">
          <img class="ly-img" title="上传图片" :src="consult.wechatPic"/>
        </el-upload>
      </li>
      <li>
        <label class="ly-label">公司简介：</label>
      </li>
      <div class="editor-container">
        <kindeditor ref="kindeditors" :content="consult.companyIntroduce"></kindeditor>
      </div>
    </ul>
    <el-button @click="$router.back(-1)">返回</el-button>
    <el-button @click="$router.back(-1)">取消</el-button>
    <el-button type="primary" @click="submit">保存</el-button>
  </div>
</template>

<script>
  import config from '@/config'
  import {mapGetters} from 'vuex'
  import {companyInfo, update} from '@/api/contact'

  export default {
    data() {
      return {
        consult: {},
        action: config.baseURL + '/upload/upload',
      }
    },
    computed: {
      ...mapGetters(['editInfo'])
    },
    methods: {
      contactUs() {
        companyInfo().then(response => {
          console.log(response)
          let result = response.data
          if (result.code === '0000') {
            this.consult = result.data
          }
        })
      },
      // 获取编辑器内容
      getContent() {
        console.log(this.$refs.kindeditor.outContent)
      },
      // 选中的分类 内容
      changeClient(e) {
        console.log(e)
      },
      handleAvatarSuccess(res, file) {
        this.consult.miniPic =res.data
      },
      handleAvatarSuccess1(res, file) {
        this.consult.wechatPic = res.data
      },
      beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
        const isLt2M = file.size / 1024 / 1024 < 2;
        if (!isJPG) {
          this.$message.error('上传图片格式错误!');
        }
        if (!isLt2M) {
          this.$message.error('上传图片大小不能超过 2MB!');
        }
        return isJPG && isLt2M;
      },
      submit() {
        let data = this.consult
        update(data).then(response => {
          let result = response.data
          if (result.code === '0000') {
            this.$message.success(result.msg)
            this.consult = result.data
          } else {
            this.$message.error(result.msg)
          }
        })
      }
    },
    created() {
      let vm = this
      setTimeout(() => {
        if (vm.$route.query.type) {
          vm.consult = vm.editInfo
        }
      }, 500)
      this.contactUs()
    },
    beforeDestroy() {
      this.consult = {}
    }
  }
</script>

<style lang="scss" scoped>

</style>